//添加抢购
import React, { useState, useEffect } from 'react';
import { PlusOutlined } from '@ant-design/icons';
import { useNavigate } from 'react-router-dom';
import {
    Button,
    Cascader,
    DatePicker,
    Form,
    Input,
    InputNumber,
    message,
    Radio,
    Select,
    Switch,
    TreeSelect,
    Space,
} from 'antd';
import '../../css/twoRouter.css'
import './css/Promotion.css'
import { getRoute, addPurchase, findAllGoods } from '../../../api/promotion';
import { number } from 'echarts';
import getSelectTime from '../../../utils/date'
const { RangePicker } = DatePicker;
export default function AddPurchase() {
    const [route, setRoute] = useState<{ sportId: number, sportName: string }[]>([])
    const [sportName, setSportName] = useState(number)
    const [options, setOptions] = useState<any>()
    const [state, setState] = useState(number) //状态 1开启
    const navigate = useNavigate()
    useEffect(() => {
        getroute()
        findAllgoods()
    }, [])

    //获取所有行程
    const getroute = () => {
        getRoute(null).then(res => {
            console.log('查询行程成功', res.data);
            setRoute(res.data)
        }).catch(err => {
            console.log('查询行程失败', err);
        })
    }

    //获取所有商品
    const findAllgoods = () => {
        findAllGoods(null).then(res => {
            const options = res.data.map((item: { name: any; sernum: any; }) => ({
                value: item.sernum,
                label: item.sernum
            }))
            setOptions(options)
            console.log('获取所有商品成功', options);

        }).catch(err => {
            console.log('获取所有商品失败', err);
        })
    }

    const newList = route.map(item => {
        return { value: item.sportId, label: item.sportName }

    })

    //发送添加请求
    const onFinish = (values: any) => {
        console.log('values', values)
        const start = values.times[0] ? getSelectTime(values.times[0]) : values.times[0]
        const end = values.times[1] ? getSelectTime(values.times[1]) : values.times[1]
        const Date = values.timek ? getSelectTime(values.timek) : values.timek
        console.log('date=====',start,end);
        
        addPurchase({
            trTitle: values.title,
            trMileage: values.money,
            trType:values.type,
            trGoods:values.number,
            trStart:start,
            trState:values.status?1:0,
            trEnd:end,
            trAdvance:Date
        }).then(res => {
            console.log('添加成功', res);
            message.success('添加成功！')
          }).catch(err => {
            console.log('失败', err);
            message.success('添加失败！')
          })
        navigate('/home/promotion/purchase')
    }

    //获取行程状态
    const sernuma = (v: any) => {
        console.log('v', v);
    }

    //获取上下架状态
    const onChange = (record: any) => {
        console.log(`switch`, record);
    };

    //获取货号状态
    const sernum = (v: any) => {
        console.log('v', v);
    }

    //返回上一页
    const goBackPage = () => {
        window.history.back()
    }

    return (
        <div>
            <Space>
                <Button className='return' onClick={goBackPage}>返回</Button>
            </Space>
            {/* 标题 */}
            <p className="head">添加抢购</p>
            {/* 添加内容 */}
            <div className='addprom'>
                <div className='box'>
                    <p>添加抢购</p>
                </div>
                {/* from表单 */}
                <div className='fromtext'>
                    <Form
                        labelCol={{ span: 10 }}
                        wrapperCol={{ span: 14 }}
                        layout="horizontal"
                        style={{ maxWidth: 600 }}
                        onFinish={onFinish}
                    >
                        <Form.Item label="抢购标题" name='title'>
                            <Input placeholder="请输入抢购标题" />
                        </Form.Item>
                        <Form.Item label="抢购详情" name='money'>
                            <InputNumber />
                        </Form.Item>
                        <Form.Item label="适用行程类型" name='type'>
                            <Select
                                options={newList}
                                onChange={sernuma}
                            >
                            </Select>
                        </Form.Item>
                        <Form.Item label="适用商品" name='number'>
                            <Select
                                options={options}
                                onChange={sernum}
                            >
                            </Select>
                        </Form.Item>
                        <Form.Item label="上架时间段" name='times'>
                            <RangePicker showTime />
                        </Form.Item>
                        <Form.Item label="预上架时间" name='timek'>
                            <DatePicker placeholder="请选择时间" showTime />
                        </Form.Item>
                        <Form.Item label="上架" valuePropName="checked" name='status'>
                            <Switch
                                onChange={onChange}
                            />
                        </Form.Item>
                        <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                            <Button type="primary" htmlType="submit">
                                提交
                            </Button>
                        </Form.Item>
                    </Form>
                </div>
            </div>
        </div>
    )
}